  // 点击返回至上一层
  document.querySelector('.icon-fanhui').addEventListener('click',()=>{
    history.go(-1)
  })

  // 找对象
  const ul = document.querySelector('#list_content')
  const titleAs = document.querySelectorAll('.list_title a')

  // 获取搜索商品的本地存储
  const search = localStorage.getItem('goodsList')
  // 首次渲染数据
  searchList()

  // 点击切换排布按钮
  let flag = true
  document.querySelector('.icon-app').addEventListener('click',()=>{
    ul.className = (flag=!flag)?'list_content1':'list_content2'
    // 判断是否要移除或添加销售额属性
      determine()
  })

  // 点击切换页面排序功能
  let flag1 = true 
  document.querySelector('.list_title ul').addEventListener('click',e=>{
    // console.dir(e.target)
    // console.log(e.target.dataset.id)
    document.querySelector('.row .icon-less').style.color = 'rgb(51, 51, 51)'
    document.querySelector('.row .icon-moreunfold').style.color = 'rgb(51, 51, 51)'
    if((e.target.tagName ==='A') || (e.target.tagName ==='DIV') ||(e.target.tagName ==='SPAN')){
      const active =  document.querySelector('.list_title .active')
      // 排他
      if(active){active.classList.remove('active')}
      // 给自己添加active
      titleAs[e.target.dataset.id].classList.add('active')
    }
    // 点击综合
    if(e.target.dataset.id==='0') {
      flag1 = true
      searchList()
    }
    // 点击销售
    if(e.target.dataset.id==='1') {
      flag1 = true
      axios({ url:'/goods/list',params:{goodsName:search}}).then(result =>{
        // console.log(result.data.data.list.data)
        const goods = result.data.data.list.data
        const sales =  goods.sort((a,b)=>b.goods_sales - a.goods_sales)
        render(sales)
      })
    }
    // 点击价格
    if(e.target.dataset.id==='2') {
      axios({ url:'/goods/list',params:{goodsName:search}}).then(result =>{
        // console.log(result.data.data.list.data)
        const goods = result.data.data.list.data
        const price  = (flag1 = !flag1)?goods.sort((a,b)=>a.goods_price_max - b.goods_price_max):goods.sort((a,b)=>b.goods_price_max - a.goods_price_max)
        if(!flag1) {
          document.querySelector('.row .icon-less').style.color = 'rgb(51, 51, 51)'
          document.querySelector('.row .icon-moreunfold').style.color = 'rgb(228, 154, 61)'
        }
        if(flag1) {
          document.querySelector('.row .icon-less').style.color = 'rgb(228, 154, 61)'
          document.querySelector('.row .icon-moreunfold').style.color = 'rgb(51, 51, 51)'
        }
        render(price)
      })
    }
  })

  // 点击商品获取商品id存入本地
  document.querySelector('#list_content').addEventListener('click',e =>{
    // console.log(e.target.dataset.id)
    localStorage.setItem('goodsInformation',e.target.dataset.id)
    location.href = './information.html'
  })










  // 封装函数：获取搜索内容的数据
  async function searchList() {
    const result = await axios({ url:'/goods/list',params:{goodsName:search}})
    // console.log(result)
    // console.log(result.data.data.list.data)
    const goodsTotal = result.data.data.list.data
    // 获取数据渲染
    render(goodsTotal)
  }

  // 封装数据渲染
  function render(goods) {
    document.querySelector('#list_content').innerHTML = goods.map(item=>{
      const {line_price_max} = item
      return`
        <li>
          <a href="javascript:;">
            <div class="pic">
              <img src="${item.goods_image}" alt="" data-id="${item.goods_id}">
            </div>
            <div class="info">
              <div class="txt ellipsis-2" data-id="${item.goods_id}">${item.goods_name}</div>
              <div class="sell" data-id="${item.goods_id}">已售${item.goods_sales}件</div>
              <div class="price" data-id="${item.goods_id}">
                <span class="one">￥<i data-id="${item.goods_id}">${item.goods_price_min}</i></span>
                <span class="two">${line_price_max==='0.00'?'':`￥<i data-id="${item.goods_id}">${line_price_max}</i>`}</span>
              </div>
            </div>
          </a>
        </li> 
      `
    }).join('')
  
    // 判断是否要移除销售额
    determine()
  }


  // 封装函数：判断是否要移除销售额
  function determine() {
    if(ul.classList.contains('list_content1')){
      document.querySelector('.list_tab_more .more').className='iconfont icon-app more'
      document.querySelectorAll('#list_content .sell').forEach(item=>{
      return  item.style.display='none'
      })
     } else {
       document.querySelector('.list_tab_more .more').className='iconfont icon-menu more'
      document.querySelectorAll('#list_content .sell').forEach(item=>{
       return  item.style.display='block'
      })
     }
  }




